<template>
    <div class="splist">
        <el-form :inline="true" size="large">
            <inp label="分类编号: "></inp>
            <inp label="分类名称: " ></inp>
            <but />
        </el-form>
        <tab :head="header1" :foo="tabelppdj" >
            <el-radio-group size="large">
                <el-radio-button label="全部" />
                <el-radio-button label="好评" />
                <el-radio-button label="中评" />
                <el-radio-button label="差评" />
            </el-radio-group>
            <template #but="butPorps"  >
                <Dialog @subadd="Change(butPorps,onlyId)" >修改</Dialog>
                <el-button @click="shanChu(butPorps,onlyId)" :id="butPorps.text.id" >删除</el-button>
            </template>
        </tab>
    </div>
</template>
<script setup>
import { onMounted, computed,reactive,provide,ref } from "vue"
import { useCounterStore } from "@/pinia/index.js"
import { res } from "@/unit/index.js"
import { useRoute } from 'vue-router'
import  { listAll } from "../../api/tabel.js"
import { onlyId } from "../../commonjs/router-tabel-id"
import { loading,Delete,xiugai } from "../../commonjs/index.js"
const store = useCounterStore()
const header1 = [{ key: 'numbe', name: "分类编码" }, { key: 'name', name: "分类名称" },{ key: 'same', name: "排序" }]
//css样式数据
provide("csstable","margin:15px")
const splist1 = JSON.parse(localStorage.getItem("splist1"))
const tabelppdj = ref([])
// console.log(tabelppdj)

onMounted(()=>{
    //表格头和模态框字符
    store.$patch({
        formListName: header1,  
    })
    //双向绑定模板
    store.$state.formmodel = { numbe: "", name: "", same: ""}
    //获取初始dom数据
    //初始化dom数据
    const sj =  loading(onlyId.value).then(data=>{
        tabelppdj.value = data
        // console.log(tabelppdj.value)
    })
})

function shanChu(sj,onlyid){
    Delete(sj, onlyid)
        .then(data => {
            tabelppdj.value = data
            // localStorage.setItem(onlyid, JSON.stringify(tabelppdj))
        })
}

//修改
function Change(e,id){
    xiugai(e,id)
    .then(data => {
            tabelppdj.value = data
            // localStorage.setItem(onlyId, JSON.stringify(onlyId))
        })
}
</script>
